<template>
	<view class="whitePage">
		<view class="flex u-border-bottom pad20" v-for="(item, index) in list" :key="index">
			<u-avatar :src="item.avatar" size="150rpx" />
			<view class="info">
				<text>{{ item.nickname || 'xxxx' }}</text>
				<view>手机号：{{ item.mobile }}</view>
				<view>已授权门店：{{ item.storeName }}</view>
			</view>
			<view class="btnBox">
				<view @click="delDoctor(item)">删除</view>
				<view @click="goRouter(`./edit?sign=${item.sign}`)">编辑</view>
				<view @click="goRouter(`./addUserList?sign=${item.sign}`)">分配患者</view>
			</view>
		</view>
		<u-empty v-if="!list.length" mode="list" text="暂无数据..." />
		<view class="fixBottomBtn" @click="goRouter('./edit')">新增人员</view>
	</view>
</template>

<script>
import { doctorList, deleteDoctor } from '@/api/doctor.js';
export default {
	data() {
		return {
			list: []
		}
	},
	onShow() {
		this.getDoctorList()
	},
	methods: {
		// 删除医生
		delDoctor(row) {
			const {sign, nickname} = row
			uni.showModal({
				title: '提示',
				content: `确定删除${ nickname }?`,
				success: (res) => {
					if(res.confirm) {
						deleteDoctor({ sign }).then(() => this.getDoctorList())
					}
				}
			})
		},
		// 获取医生列表
		getDoctorList() {
			doctorList().then(res => this.list = res)
		},
		// 页面跳转
		goRouter(url) {
			uni.navigateTo({ url })
		}
	}
}
</script>

<style lang="scss" scoped>
.whitePage {
	padding-bottom: 120rpx;
}
.info {
	flex: 1;
	margin-left: 20rpx;
	view {
		color: rgba(0, 0, 0, 0.6);
		font-size: 24rpx;
		margin-top: 20rpx;
	}
	text {
		font-size: 32rpx;
	}
}
.btnBox {
	view {
		font-size: 26rpx;
		border-radius: 15rpx;
		padding: 6rpx 30rpx;
		text-align: center;
		color: #fe5e10;
		border: 2rpx solid #fe5e10;
		&:nth-child(2) {
			margin: 20rpx 0;
			color: #33a3dc;
			border-color: #33a3dc;
		}
		&:last-child {
			color: #19be6b;
			border-color: #19be6b;
		}
	}
}
</style>
